<template>
  <div class="container">
    <div class="home">
      <div class="logo">
        <img src="../assets/images/ai.jpg" alt="" />
        <div>价值工程多模态大模型-信号专业</div>
      </div>
      <div>
        <nav>
          <!-- <router-link to="/g_home" v-if="type!=2">知识库</router-link> -->
          <!-- <router-link to="/files?id=1807975737674326017">知识库</router-link> -->
          <router-link to="/about">会话</router-link>
          <router-link to="/web">会话2</router-link>
        </nav>
      </div>
      <div class="name">
        <el-dropdown @command="handleCommand">
          <span class="el-dropdown-link">
            {{ account }}<i class="el-icon-arrow-down el-icon--right"></i>
          </span>
          <el-dropdown-menu slot="dropdown">
            <el-dropdown-item command="a">退出登录</el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
      </div>
    </div>
    <router-view />
  </div>
</template>

<script>
export default {
  data() {
    return {
      account: JSON.parse(localStorage.getItem("userInfo")).account,
      type: JSON.parse(localStorage.getItem("userInfo")).type,
    };
  },
  created() {
    //  let userInfo = JSON.parse(localStorage.getItem("userInfo"));
    //  let type= userInfo.type;
    //  if (type==2) {
    //   this.$router.push({
    //   path: "/about",
    // });
    //  }else{
    //   this.$router.push({
    //   path: "/g_home",
    // });
    //  }
    this.$router.push({ path: "/" });
  },
  methods: {
    handleCommand(command) {
      if (command === "a") {
        localStorage.removeItem("userInfo");
        this.$router.push({
          path: "/login",
        });
      }
    },
  },
};
</script>
<style scoped>
.container {
  width: 100%;
  height: 100%;
  margin-top: 60px;
  overflow: hidden;
  /* background-color:; */
  /* border: 1px soild red !important; */
  box-sizing: border-box;
  font-family: "PingFang SC";
}
.home {
  width: 100%;
  /* height: 60px; */
  display: flex;
  justify-content: space-between;
  align-items: center;
  /* border-bottom: 1px solid #ccc; */
  /* background-color: #151e2f; */
  /* background-color: #ffff; */
  /* opacity: 0.8; */
  position: fixed;
  left: 0;
  top: 0;
  z-index: 1;
  display: none;
  /* opacity: .5; */
}
.el-dropdown-link {
  cursor: pointer;
  color: #409eff;
}
.el-icon-arrow-down {
  font-size: 12px;
}
/* .home::before{
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0.5;
  backdrop-filter: blur(10px);

} */
nav {
  display: flex;
  justify-content: center;
  /* width: 240px; */
  /* height: 40px;
align-items: center; */
  /* border: 1px solid red; */
  margin-right: 400px;
  background-color: #f9f9f9;
  font-family: Inter;
}

nav a {
  width: 100px;
  height: 35px;
  line-height: 35px;
  display: block;
  color: #2c3e50;
  text-decoration: none;
  /* border: 1px solid  rgb(199, 237, 204) ; */
  /* padding: 8px 20px; */
  border-radius: 4px;
  text-align: center;
}
nav a:hover {
  color: green;
}
nav a.router-link-exact-active {
  font-weight: bold;
  /* color: rgb(88 199 250 / 100%); */
  border: 1px solid rgb(199, 237, 204);
  /* color:#000; */
  background: #85ce61;
  border-color: #85ce61;
  color: #fff;
}
.logo {
  /* margin-left: 20px; */
  width: 300px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.logo img {
  width: 40px;
  height: 40px;
  border-radius: 50%;
}
.logo {
  font-family: Inter;
  font-size: 18px;
  font-weight: 500;
  color: #2c3e50;
  background: #fff;
}

.name {
  margin-right: 20px;
}
</style>
